<template>
  <el-dialog :visible.sync="visible" v-dialogDrag :title="title" :close-on-click-modal="false" class="tl-dialog" width="800px" @open="open" @close="close" append-to-body>
    <el-form class="tl-form" ref="form" :model="model" :rules="rules" label-width="150px" :disabled="true">
      <el-row>
        <el-col :span="12">
          <el-form-item label="任务转办" prop="turnusercode" :rules="rules.validateRequire">
            <tl-ref-user  v-model="model.turnusercode" :initDisplayData.sync="model.turnusername" dataType="code" :singleSelect="true" @confirm="confirmUser"></tl-ref-user>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="任务负责人" prop="responsibleusercode" :rules="rules.validateRequire">
            <tl-ref-user  v-model="model.responsibleusercode" :initDisplayData.sync="model.responsibleusername" dataType="code" :singleSelect="true" :disabled="true"></tl-ref-user>
          </el-form-item>
        </el-col>
      </el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="任务名称" prop="name" :rules="rules.validateRequire">
						<el-input v-model="model.name" :maxlength="100" show-word-limit placeholder="请输入任务名称" :disabled="true"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="任务描述" prop="introduction" :rules="rules.validateRequire">
						<el-input v-model="model.introduction" type="textarea" :rows="2" :maxlength="1000" show-word-limit placeholder="请输入任务描述" :disabled="true"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="计划开始时间" prop="planbegintime" :rules="rules.validateRequire">
						<el-date-picker v-model="model.planbegintime" type="date" placeholder="计划开始时间" value-format="yyyy-MM-dd 00:00:00" :disabled="true"></el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="计划结束时间" prop="planendtime" :rules="rules.validateRequire">
						<el-date-picker v-model="model.planendtime" type="date" placeholder="计划结束时间" value-format="yyyy-MM-dd 23:59:59" :disabled="true"></el-date-picker>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="预估工时" prop="planhours" :rules="[ ...rules.validateRequire ]">
            <el-input v-model="model.planhours" type="number" style="width: 100%;" :disabled="true"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="confirmBackLabourTask(1)" :loading="saveLoading" v-if="disableEditSubmit === false">任务关闭</el-button>
      <el-button type="primary" @click="confirmBackLabourTask(2)" :loading="saveLoading" v-if="disableEditSubmit === false">任务转办</el-button>
      <el-button type="primary" @click="confirmBackLabourTask(3)" :loading="saveLoading" v-if="disableEditSubmit === false">任务退回</el-button>
    </div>
  </el-dialog>
</template>

<script>
/** mixins */
import { mixin_edit } from '@tapui/mixins/mixin_edit'
/** 子组件 */
/** 工具类 */
import { putAction, getAction, postAction, deleteAction } from '@tapui/utils/http'
import { checkPositiveInt } from '../../../utils/numberValidate'
import { TASK_BACK_HANDLE_TYPE } from '../../../const/const'
/** VUE配置 */
export default {
  mixins: [mixin_edit],
  data() {
    return {
      moduleTitle: '处理任务退回',
      urlPrefix: '/cbb/pmTask/',
      url: {
        // 额外的url
        load: '/backRecordInfo',
        confirmBackLabourTask: '/cbb/pmTask/confirmBackLabourTask'
      }
    }
  },
  props: {
  },
  computed: {
  },
  methods: {
    loaded() {
      // 页面加载完毕执行
    },
    open() {
      this.model = {}
      this.$nextTick(() => {
        this.$refs.form.clearValidate()
        if (this.isAdd === true) {
          this.title = '添加' + this.moduleTitle
          // 需要添加重复判断
          if (this.$store.getters.param.isAvoidRepeat === true) {
            this.queryBillUid()
          }
          if (this.isQueryInitData === true) {
            // 后台进行数据初始化
            this.queryInitData().then((_) => {
              this.assignDefaultValue()
              this.$refs.form.clearValidate()
              this.loaded()
            })
          } else {
            // 前台进行数据初始化
            this.$set(this.model, 'enabled', 1)
            this.$set(this.model, 'sortcode', 0)
            this.assignDefaultValue()
            this.$refs.form.clearValidate()
            this.loaded()
          }
        } else if (this.disableEditSubmit === false) {
          this.title = '编辑' + this.moduleTitle
          this.queryData(this.id).then((_) => {
            this.loaded()
          })
        } else {
          this.title = '查看' + this.moduleTitle
          this.queryData(this.id).then((_) => {
            this.$refs.form.clearValidate()
            this.loaded()
          })
        }
      })
    },
    confirmUser(selectedData) {
    },
    confirmBackLabourTask(handletype) {
      let param = {
        taskcode: this.model.code,
        handletype: handletype
      }
      if (TASK_BACK_HANDLE_TYPE.TURN === handletype) {
        if (!this.model.turnusercode) {
          this.$tap.alert('请选择转办的任务负责人')
          return
        }
        param.turnusercode = this.model.turnusercode
        param.turnusername = this.model.turnusername
      }
      this.saveLoading = true
      postAction(this.url.confirmBackLabourTask, param).then((res) => {
          if (res.success) {
            this.$tap.message(res.message)
            this.$emit('refresh')
          } else {
            this.$tap.alert(res.message)
          }
        this.saveLoading = false
      }).catch((err) => {
        this.saveLoading = false
        this.$tap.alert(err.message)
      })
    }
  },
  created() {
    console.log(this.user)
  }
}
</script>
<style lang="scss" scoped>
  /deep/ input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
  }

  /deep/ input::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
  }

  input[type="number"] {
    -moz-appearance: textfield;
  }
</style>
